<!DOCTYPE html>
<!--[if IE 9]> <html lang="en" class="ie9"> <![endif]-->
<!--[if gt IE 9]> <html lang="en" class="ie"> <![endif]-->
<!--[if !IE]><!-->
<html lang="en">
	<!--<![endif]-->

	<head>
		<meta charset="utf-8">
		<title>The Project | Home Landing</title>
		<meta name="description" content="The Project a Bootstrap-based, Responsive HTML5 Template">
		<meta name="author" content="htmlcoder.me">

		<!-- Mobile Meta -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0">

		<!-- Favicon -->
		<link rel="shortcut icon" href="../dict/images/favicon.ico">

		<!-- Web Fonts -->
		<link href='https://fonts.googleapis.com/css?family=Lato:400,300,300italic,400italic,700,700italic' rel='stylesheet' type='text/css'>
		<link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,300,100,700' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=PT+Serif' rel='stylesheet' type='text/css'>

		<!-- Bootstrap core CSS -->
		<link href="../plugins/bootstrap/css/bootstrap.css" rel="stylesheet">

		<!-- Font Awesome CSS -->
		<link href="../dict/fonts/font-awesome/css/font-awesome.css" rel="stylesheet">

		<!-- Fontello CSS -->
		<link href="../dict/fonts/fontello/css/fontello.css" rel="stylesheet">

		<!-- Plugins -->
		<link href="../plugins/magnific-popup/magnific-popup.css" rel="stylesheet">
		<link href="../plugins/rs-plugin-5/css/settings.css" rel="stylesheet">
		<link href="../plugins/rs-plugin-5/css/layers.css" rel="stylesheet">
		<link href="../plugins/rs-plugin-5/css/navigation.css" rel="stylesheet">
		<link href="../dict/css/animations.css" rel="stylesheet">
		<link href="../plugins/owl-carousel/owl.carousel.css" rel="stylesheet">
		<link href="../plugins/owl-carousel/owl.transitions.css" rel="stylesheet">
		<link href="../plugins/hover/hover-min.css" rel="stylesheet">
		
		<!-- The Project's core CSS file -->
		<link href="../dict/css/style.css" rel="stylesheet" >
		<!-- The Project's Typography CSS file, includes used fonts -->
		<!-- Used font for body: Lato -->
		<!-- Used font for headings: Roboto Slab -->
		<link href="../dict/css/typography-scheme-2.css" rel="stylesheet" >
		<!-- Color Scheme (In order to change the color scheme, replace the blue.css with the color scheme that you prefer)-->
		<link href="../dict/css/skins/blue.css" rel="stylesheet">
		

		<!-- Custom css --> 
		<link href="../dict/css/custom.css" rel="stylesheet">
	</head>

	<!-- body classes:  -->
	<!-- "boxed": boxed layout mode e.g. <body class="boxed"> -->
	<!-- "pattern-1 ... pattern-9": background patterns for boxed layout mode e.g. <body class="boxed pattern-1"> -->
	<!-- "transparent-header": makes the header transparent and pulls the banner to top -->
	<!-- "gradient-background-header": applies gradient background to header -->
	<!-- "page-loader-1 ... page-loader-6": add a page loader to the page (more info @components-page-loaders.html) -->
	<body class="no-trans front-page transparent-header gradient-background-header page-loader-1">

		<!-- scrollToTop -->
		<!-- ================ -->
		<div class="scrollToTop circle"><i class="icon-up-open-big"></i></div>
		
		<!-- page wrapper start -->
		<!-- ================ -->
		<div class="page-wrapper">
		
			<!-- header-container start -->
			<div class="header-container">
				
				
				<!-- header start -->
				<!-- classes:  -->
				<!-- "fixed": enables fixed navigation mode (sticky menu) e.g. class="header fixed clearfix" -->
				<!-- "dark": dark version of header e.g. class="header dark clearfix" -->
				<!-- "full-width": mandatory class for the full-width menu layout -->
				<!-- "centered": mandatory class for the centered logo layout -->
				<!-- ================ --> 
				<header class="header  fixed fixed-before full-width dark clearfix">
					
								<!-- header-right start -->
								<!-- ================ -->
								<div class="header-right clearfix">
									
								<!-- main-navigation start -->
								<!-- classes: -->
								<!-- "onclick": Makes the dropdowns open on click, this the default bootstrap behavior e.g. class="main-navigation onclick" -->
								<!-- "animated": Enables animations on dropdowns opening e.g. class="main-navigation animated" -->
								<!-- "with-dropdown-buttons": Mandatory class that adds extra space, to the main navigation, for the search and cart dropdowns -->
								<!-- ================ -->
								<div class="main-navigation  animated with-dropdown-buttons">

									<!-- navbar start -->
									<!-- ================ -->
									<nav class="navbar navbar-default" role="navigation">
										<div class="container-fluid">

											<!-- Toggle get grouped for better mobile display -->
											<div class="navbar-header">
												<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
													<span class="sr-only">Toggle navigation</span>
													<span class="icon-bar"></span>
													<span class="icon-bar"></span>
													<span class="icon-bar"></span>
												</button>
												
												<!-- header-left start -->
												<!-- ================ -->
												<div class="header-left clearfix ">

													<!-- logo -->
													<div id="logo-mobile" class="logo">
														<a href="index.html"><img id="logo-img-mobile" src="../dict/images/logo_blue.png" alt="The Project"></a>
													</div>

													<!-- name-and-slogan -->
													<div class="site-slogan hidden-xs">
														Multipurpose HTML5 Template
													</div>

												</div>
												<!-- header-left end -->
												
											</div>

											<!-- Collect the nav links, forms, and other content for toggling -->
											<div class="collapse navbar-collapse" id="navbar-collapse-1">
												<!-- main-menu -->
												<ul class="nav navbar-nav navbar-right">

													<!-- mega-menu start -->
													<li class="dropdown active mega-menu">
														<a href="index.html" class="dropdown-toggle" data-toggle="dropdown">Home</a>
														<ul class="dropdown-menu">
															<li>
																<div class="row">
																	<div class="col-md-12">
																		<h4 class="title"><i class="fa fa-laptop pr-10"></i> Demos</h4>
																		<div class="row">
																			<div class="col-sm-6 col-md-3">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="index.html"><i class="icon-home pr-10"></i>Home Default</a></li>
																					<li ><a href="index-corporate-1.html"><i class="icon-suitcase pr-10"></i>Corporate 1</a></li>
																					<li ><a href="index-corporate-2.html"><i class="icon-suitcase pr-10"></i>Corporate 2</a></li>
																					<li ><a href="index-corporate-3.html"><i class="icon-suitcase pr-10"></i>Corporate 3</a></li>
																					<li ><a href="index-corporate-4.html"><i class="icon-suitcase pr-10"></i>Corporate 4 <span class="badge">v1.2</span></a></li>
																					<li ><a href="index-corporate-5.html"><i class="icon-suitcase pr-10"></i>Corporate 5 (Law Firm) <span class="badge">New</span></a></li>
																					<li ><a href="index-shop.html"><i class="icon-basket-1 pr-10"></i>Commerce 1</a></li>
																				</ul>
																			</div>
																			<div class="col-sm-6 col-md-3">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="index-shop-2.html"><i class="icon-basket-1 pr-10"></i>Commerce 2</a></li>
																					<li ><a href="index-portfolio.html"><i class="icon-briefcase pr-10"></i>Portfolio/Agency</a></li>
																					<li ><a href="index-medical.html"><i class="fa fa-ambulance pr-10"></i>Medical</a></li>
																					<li ><a href="index-restaurant.html"><i class="fa fa-cutlery pr-10"></i>Restaurant</a></li>
																					<li ><a href="index-restaurant-2.html"><i class="fa fa-cutlery pr-10"></i>Restaurant 2 <span class="badge">NEW</span></a></li>
																					<li ><a href="index-wedding.html"><i class="icon-heart pr-10"></i>Wedding</a></li>
																					<li ><a href="index-landing.html"><i class="fa fa-star pr-10"></i>Landing Page</a></li>
																				</ul>
																			</div>
																			<div class="col-sm-6 col-md-3">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li class="active"><a href="index-landing-2.html"><i class="fa fa-star pr-10"></i>Landing Page 2 <span class="badge">NEW</span></a></li>
																					<li ><a href="page-coming-soon.html"><i class="fa fa-clock-o pr-10"></i>Coming Soon</a></li>
																					<li ><a href="index-one-page.html"><i class="icon-home pr-10"></i>One Page Version</a></li>
																					<li ><a href="index-construction.html"><i class="fa fa-building pr-10"></i>Construction <span class="badge">v1.1</span></a></li>
																					<li ><a href="index-education.html"><i class="fa fa-graduation-cap pr-10"></i>Education <span class="badge">v1.1</span></a></li>
																					<li ><a href="index-hotel.html"><i class="fa fa-bed pr-10"></i>Hotel <span class="badge">v1.1</span></a></li>
																					<li ><a href="index-blog.html"><i class="fa fa-pencil pr-10"></i>Blog <span class="badge">v1.1</span></a></li>
																				</ul>
																			</div>
																			<div class="col-sm-6 col-md-3">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="index-blog-2.html"><i class="fa fa-pencil pr-10"></i>Blog 2<span class="badge">NEW</span></a></li>
																					<li ><a href="index-beauty.html"><i class="fa fa-magic pr-10"></i>Beauty Center <span class="badge">v1.1</span></a></li>
																					<li ><a href="index-gym.html"><i class="fa fa-heartbeat pr-10"></i>Gym <span class="badge">v1.2</span></a></li>
																					<li ><a href="index-resume.html"><i class="fa fa-user pr-10"></i>Resume <span class="badge">v1.2</span></a></li>
																					<li ><a href="index-agency.html"><i class="fa fa-users pr-10"></i>Agency <span class="badge">v1.2</span></a></li>
																					<li ><a href="index-logistics.html"><i class="fa fa-truck pr-10"></i>Logistics <span class="badge">v1.2</span></a></li>
																				</ul>
																			</div>
																		</div>
																	</div>
																</div>
															</li>
														</ul>
													</li>
													<!-- mega-menu end -->
													<!-- mega-menu start -->
													<li class="dropdown  mega-menu">
														<a href="#" class="dropdown-toggle" data-toggle="dropdown">Pages</a>
														<ul class="dropdown-menu">
															<li>
																<div class="row">
																	<div class="col-lg-8 col-md-9">
																		<h4 class="title">Pages</h4>
																		<div class="row">
																			<div class="col-sm-4">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="page-about.html"><i class="fa fa-angle-right"></i>About Us 1</a></li>
																					<li ><a href="page-about-2.html"><i class="fa fa-angle-right"></i>About Us 2</a></li>
																					<li ><a href="page-about-3.html"><i class="fa fa-angle-right"></i>About Us 3</a></li>
																					<li ><a href="page-about-4.html"><i class="fa fa-angle-right"></i>About Us 4</a></li>
																					<li ><a href="page-about-me.html"><i class="fa fa-angle-right"></i>About Me</a></li>
																					<li ><a href="page-team.html"><i class="fa fa-angle-right"></i>Our Team - Options 1</a></li>
																					<li ><a href="page-team-2.html"><i class="fa fa-angle-right"></i>Our Team - Options 2</a></li>
																					<li ><a href="page-team-3.html"><i class="fa fa-angle-right"></i>Our Team - Options 3</a></li>
																					<li ><a href="page-coming-soon.html"><i class="fa fa-angle-right"></i>Coming Soon Page</a></li>
																					<li ><a href="page-faq.html"><i class="fa fa-angle-right"></i>FAQ page</a></li>
																				</ul>
																			</div>
																			<div class="col-sm-4">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="page-services.html"><i class="fa fa-angle-right"></i>Services 1</a></li>
																					<li ><a href="page-services-2.html"><i class="fa fa-angle-right"></i>Services 2</a></li>
																					<li ><a href="page-services-3.html"><i class="fa fa-angle-right"></i>Services 3</a></li>
																					<li ><a href="page-contact.html"><i class="fa fa-angle-right"></i>Contact 1</a></li>
																					<li ><a href="page-contact-2.html"><i class="fa fa-angle-right"></i>Contact 2</a></li>
																					<li ><a href="page-contact-3.html"><i class="fa fa-angle-right"></i>Contact 3</a></li>
																					<li ><a href="page-login.html"><i class="fa fa-angle-right"></i>Login 1</a></li>
																					<li ><a href="page-login-2.html"><i class="fa fa-angle-right"></i>Login 2 - Fullsreen</a></li>
																					<li ><a href="page-signup.html"><i class="fa fa-angle-right"></i>Sign Up 1</a></li>
																					<li ><a href="page-signup-2.html"><i class="fa fa-angle-right"></i>Sign Up 2 - Fullsreen</a></li>
																				</ul>
																			</div>
																			<div class="col-sm-4">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="page-404.html"><i class="fa fa-angle-right"></i>404 error</a></li>
																					<li ><a href="page-404-2.html"><i class="fa fa-angle-right"></i>404 error - Parallax</a></li>
																					<li ><a href="page-affix-sidebar.html"><i class="fa fa-angle-right"></i>Sidebar - Affix Menu</a></li>
																					<li ><a href="page-left-sidebar.html"><i class="fa fa-angle-right"></i>Left Sidebar</a></li>
																					<li ><a href="page-right-sidebar.html"><i class="fa fa-angle-right"></i>Right Sidebar</a></li>
																					<li ><a href="page-two-sidebars.html"><i class="fa fa-angle-right"></i>Two Sidebars</a></li>
																					<li ><a href="page-two-sidebars-left.html"><i class="fa fa-angle-right"></i>Two Sidebars Left</a></li>
																					<li ><a href="page-two-sidebars-right.html"><i class="fa fa-angle-right"></i>Two Sidebars Right</a></li>
																					<li ><a href="page-no-sidebars.html"><i class="fa fa-angle-right"></i>No Sidebars</a></li>
																					<li ><a href="page-sitemap.html"><i class="fa fa-angle-right"></i>Sitemap</a></li>
																				</ul>
																			</div>
																		</div>
																	</div>
																	<div class="col-lg-4 col-md-3 hidden-sm">
																		<h4 class="title">Premium HTML5 Template</h4>
																		<p class="mb-10">The Project is perfectly suitable for corporate, business and company webpages.</p>
																		<img src="../dict/images/section-image-3.png" alt="The Project">
																	</div>
																</div>
															</li>
														</ul>
													</li>
													<!-- mega-menu end -->
													<li class="dropdown ">
														<a class="dropdown-toggle" data-toggle="dropdown" href="#">Features</a>
														<ul class="dropdown-menu">
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Headers <span class="badge">v1.2</span></a>
																<ul class="dropdown-menu">
																	<li ><a href="features-headers-default.html">Default/Semi-Transparent</a></li>
																	<li ><a href="features-headers-default-dark.html">Dark/Semi-Transparent</a></li>
																	<li ><a href="features-headers-gradient-dark.html">Gradient Dark <span class="badge">v1.2</span></a></li>
																	<li ><a href="features-headers-gradient-light.html">Gradient Light <span class="badge">v1.2</span></a></li>
																	<li ><a href="features-headers-classic.html">Classic Light</a></li>
																	<li ><a href="features-headers-classic-dark.html">Classic Dark</a></li>
																	<li ><a href="features-headers-colored.html">Colored/Light</a></li>
																	<li ><a href="features-headers-colored-dark.html">Colored/Dark</a></li>
																	<li ><a href="features-headers-full-width.html">Full Width</a></li>
																	<li ><a href="features-headers-offcanvas-left.html">Offcanvas Left Side</a></li>
																	<li ><a href="features-headers-offcanvas-right.html">Offcanvas Right Side</a></li>
																	<li ><a href="features-headers-logo-centered.html">Logo Centered</a></li>
																	<li ><a href="features-headers-slider-top.html">Slider Top</a></li>
																	<li ><a href="features-headers-simple.html">Simple Static</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Sticky Headers <span class="badge">v1.2</span></a>
																<ul class="dropdown-menu">
																	<li ><a href="features-headers-default.html">Default</a></li>
																	<li ><a href="features-headers-sticky-2.html">Alternative <span class="badge">v1.2</span></a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Menus</a>
																<ul class="dropdown-menu">
																	<li ><a href="features-headers-default.html">Default/On Hover Menu</a></li>
																	<li ><a href="features-menus-onhover-no-animations.html">On Hover Menu - No Animations</a></li>
																	<li ><a href="features-menus-onclick.html">On Click Menu - With Animations</a></li>
																	<li ><a href="features-menus-onclick-no-animations.html">On Click Menu - No Animations</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Footers <span class="badge">v1.2</span></a>
																<ul class="dropdown-menu">
																	<li ><a href="features-footers-default.html#footer">Default</a></li>
																	<li ><a href="features-footers-contact-form.html#footer">Contact Form</a></li>
																	<li ><a href="features-footers-contact-form-2.html#footer">Contact Form 2 <span class="badge">v1.2</span></a></li>
																	<li ><a href="features-footers-google-maps.html#footer">Google Maps</a></li>
																	<li ><a href="features-footers-subscribe.html#footer">Subscribe Form</a></li>
																	<li ><a href="features-footers-minimal.html#footer">Minimal</a></li>
																	<li ><a href="features-footers-links.html#footer">Links <span class="badge">v1.1</span></a></li>
																	<li ><a href="features-footers-full-width.html#footer">Full Width <span class="badge">v1.2</span></a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Main Sliders <span class="badge">v1.2</span></a>
																<ul class="dropdown-menu">
																	<li class="dropdown-header default-bg-50">SLIDER REVOLUTION 5 - v1.2</li>
																	<li ><a href="features-sliders-fullscreen.html">Full Screen</a></li>
																	<li ><a href="features-sliders-fullwidth.html">Full Width</a></li>
																	<li ><a href="features-sliders-fullwidth-big-height.html">Full Width - Big Height</a></li>
																	<li ><a href="features-sliders-boxedwidth-light.html">Boxed Width - Light Bg</a></li>
																	<li ><a href="features-sliders-boxedwidth-dark.html">Boxed Width - Dark Bg</a></li>
																	<li ><a href="features-sliders-boxedwidth-default.html">Boxed Width - Default Bg</a></li>
																	<li ><a href="features-sliders-video-background.html">Video Background</a></li>
																	<li ><a href="features-sliders-text-rotator.html">Text Rotator</a></li>
																	<li  class="dropdown ">
																	<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Revolution 4</a>
																		<ul class="dropdown-menu">
																			<li ><a href="features-sliders-revolution-4-fullscreen.html">Full Screen</a></li>
																			<li ><a href="features-sliders-revolution-4-fullwidth.html">Full Width</a></li>
																			<li ><a href="features-sliders-revolution-4-fullwidth-big-height.html">Full Width - Big Height</a></li>
																			<li ><a href="features-sliders-revolution-4-boxedwidth-light.html">Boxed Width - Light Bg</a></li>
																			<li ><a href="features-sliders-revolution-4-boxedwidth-dark.html">Boxed Width - Dark Bg</a></li>
																			<li ><a href="features-sliders-revolution-4-boxedwidth-default.html">Boxed Width - Default Bg</a></li>
																			<li ><a href="features-sliders-revolution-4-video-background.html">Video Background</a></li>
																			<li ><a href="features-sliders-revolution-4-text-rotator.html">Text Rotator</a></li>
																		</ul>
																	</li>
																</ul>
															</li>
															<li class="dropdown">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Email Templates <span class="badge">v1.1</span></a>
																<ul class="dropdown-menu">
																	<li><a target="_blank" href="email_templates/email_template_blue.html">Blue</a></li>
																	<li><a target="_blank" href="email_templates/email_template_brown.html">Brown</a></li>
																	<li><a target="_blank" href="email_templates/email_template_cool_green.html">Cool Green</a></li>
																	<li><a target="_blank" href="email_templates/email_template_dark_cyan.html">Dark Cyan</a></li>
																	<li><a target="_blank" href="email_templates/email_template_dark_red.html">Dark Red</a></li>
																	<li><a target="_blank" href="email_templates/email_template_gold.html">Gold</a></li>
																	<li><a target="_blank" href="email_templates/email_template_gray.html">Gray</a></li>
																	<li><a target="_blank" href="email_templates/email_template_green.html">Green</a></li>
																	<li><a target="_blank" href="email_templates/email_template_light_blue.html">Light Blue</a></li>
																	<li><a target="_blank" href="email_templates/email_template_orange.html">Orange</a></li>
																	<li><a target="_blank" href="email_templates/email_template_pink.html">Pink</a></li>
																	<li><a target="_blank" href="email_templates/email_template_purple.html">Purple</a></li>
																	<li><a target="_blank" href="email_templates/email_template_red.html">Red</a></li>
																	<li><a target="_blank" href="email_templates/email_template_vivid_red.html">Vivid Red</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Pricing Tables</a>
																<ul class="dropdown-menu">
																	<li ><a href="features-pricing-tables-1.html">Pricing Tables 1</a></li>
																	<li ><a href="features-pricing-tables-2.html">Pricing Tables 2</a></li>
																	<li ><a href="features-pricing-tables-3.html">Pricing Tables 3</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Icons</a>
																<ul class="dropdown-menu">
																	<li ><a href="features-icons-fontawesome.html">Font Awesome</a></li>
																	<li ><a href="features-icons-fontello.html">Fontello</a></li>
																	<li ><a href="features-icons-glyphicons.html">Glyphicons</a></li>
																</ul>
															</li>
															<li ><a href="features-dark-page.html">Dark Page</a></li>
															<li ><a href="features-typography.html">Typography</a></li>
															<li ><a href="features-backgrounds.html">Backgrounds</a></li>
															<li ><a href="features-grid.html">Grid</a></li>
														</ul>
													</li>
													<!-- mega-menu start -->
													<li class="dropdown  mega-menu narrow">
														<a href="#" class="dropdown-toggle" data-toggle="dropdown">Components</a>
														<ul class="dropdown-menu">
															<li>
																<div class="row">
																	<div class="col-md-12">
																		<h4 class="title"><i class="fa fa-magic pr-10"></i> Components</h4>
																		<div class="row">
																			<div class="col-sm-6">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="components-social-icons.html"><i class="icon-share pr-10"></i>Social Icons</a></li>
																					<li ><a href="components-buttons.html"><i class="icon-flask pr-10"></i>Buttons</a></li>
																					<li ><a href="components-forms.html"><i class="icon-eq pr-10"></i>Forms</a></li>
																					<li ><a href="components-tabs-and-pills.html"><i class=" icon-dot-3 pr-10"></i>Tabs &amp; Pills</a></li>
																					<li ><a href="components-accordions.html"><i class="icon-menu-outline pr-10"></i>Accordions</a></li>
																					<li ><a href="components-progress-bars.html"><i class="icon-chart-line pr-10"></i>Progress Bars</a></li>
																					<li ><a href="components-call-to-action.html"><i class="icon-chat pr-10"></i>Call to Action Blocks</a></li>
																					<li ><a href="components-alerts-and-callouts.html"><i class="icon-info-circled pr-10"></i>Alerts &amp; Callouts</a></li>
																					<li ><a href="components-content-sliders.html"><i class="icon-star-filled pr-10"></i>Content Sliders</a></li>
																					<li ><a href="components-charts.html"><i class="icon-chart-pie pr-10"></i>Charts</a></li>
																					<li ><a href="components-page-loaders.html"><i class="fa fa-circle-o-notch fa-spin"></i>Page Loaders <span class="badge">v1.1</span></a></li>
																					<li ><a href="components-icon-boxes.html"><i class="icon-picture-outline pr-10"></i>Icon Boxes</a></li>
																				</ul>
																			</div>
																			<div class="col-sm-6">
																				<div class="divider"></div>
																				<ul class="menu">
																					<li ><a href="components-image-boxes.html"><i class="icon-camera-1 pr-10"></i>Image Boxes</a></li>
																					<li ><a href="components-fullwidth-sections.html"><i class="icon-code-1 pr-10"></i>Full Width Sections</a></li>
																					<li ><a href="components-animations.html"><i class="icon-docs pr-10"></i>Animations</a></li>
																					<li ><a href="components-video-and-audio.html"><i class="icon-video pr-10"></i>Video &amp; Audio</a></li>
																					<li ><a href="components-lightbox.html"><i class="icon-plus pr-10"></i>Lightbox</a></li>
																					<li ><a href="components-counters.html"><i class="icon-sort-numeric pr-10"></i>Counters</a></li>
																					<li ><a href="components-modals.html"><i class="icon-popup pr-10"></i>Modals</a></li>
																					<li ><a href="components-tables.html"><i class="icon-th pr-10"></i>Tables</a></li>
																					<li ><a href="components-text-rotators.html"><i class="icon-arrows-ccw pr-10"></i>Text Rotators</a></li>
																					<li ><a href="components-announcement-default.html"><i class="icon-megaphone pr-10"></i>Announcements <span class="badge">NEW</span></a></li>
																					<li ><a href="components-separators.html"><i class="icon-star pr-10"></i>Separators <span class="badge">NEW</span></a></li>
																				</ul>
																			</div>
																		</div>
																	</div>
																</div>
															</li>
														</ul>
													</li>
													<!-- mega-menu end -->
													<li class="dropdown ">
														<a href="portfolio-grid-2-3-col.html" class="dropdown-toggle" data-toggle="dropdown">Portfolio</a>
														<ul class="dropdown-menu">
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Portfolio Grid 1</a>
																<ul class="dropdown-menu">
																	<li ><a href="portfolio-grid-1-2-col.html">2 Column</a></li>
																	<li ><a href="portfolio-grid-1-3-col.html">3 Column</a></li>
																	<li ><a href="portfolio-grid-1-4-col.html">4 Column</a></li>
																	<li ><a href="portfolio-grid-1-sidebar.html">With Sidebar</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Portfolio Grid 2</a>
																<ul class="dropdown-menu">
																	<li ><a href="portfolio-grid-2-2-col.html">2 Column</a></li>
																	<li ><a href="portfolio-grid-2-3-col.html">3 Column</a></li>
																	<li ><a href="portfolio-grid-2-4-col.html">4 Column</a></li>
																	<li ><a href="portfolio-grid-2-sidebar.html">With Sidebar</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Portfolio Grid 3 - Dark</a>
																<ul class="dropdown-menu">
																	<li ><a href="portfolio-grid-3-2-col.html">2 Column</a></li>
																	<li ><a href="portfolio-grid-3-3-col.html">3 Column</a></li>
																	<li ><a href="portfolio-grid-3-4-col.html">4 Column</a></li>
																	<li ><a href="portfolio-grid-3-sidebar.html">With Sidebar</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Portfolio Fullwidth</a>
																<ul class="dropdown-menu">
																	<li ><a href="portfolio-fullwidth-2-col.html">2 Column</a></li>
																	<li ><a href="portfolio-fullwidth-3-col.html">3 Column</a></li>
																	<li ><a href="portfolio-fullwidth-4-col.html">4 Column</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Portfolio List</a>
																<ul class="dropdown-menu">
																	<li ><a href="portfolio-list-1.html">List - Large Images</a></li>
																	<li ><a href="portfolio-list-2.html">List - Small Images</a></li>
																	<li ><a href="portfolio-list-sidebar.html">With Sidebar</a></li>
																</ul>
															</li>
															<li ><a href="portfolio-item.html">Single Item 1</a></li>
															<li ><a href="portfolio-item-2.html">Single Item 2</a></li>
															<li ><a href="portfolio-item-3.html">Single Item 3</a></li>
														</ul>
													</li>
													<li class="dropdown ">
														<a href="index-shop.html" class="dropdown-toggle" data-toggle="dropdown">Shop</a>
														<ul class="dropdown-menu">
															<li ><a href="index-shop.html">Shop Home 1</a></li>
															<li ><a href="index-shop-2.html">Shop Home 2</a></li>
															<li ><a href="shop-listing-4col.html">Grid - 4 Columns</a></li>
															<li ><a href="shop-listing-3col.html">Grid - 3 Columns</a></li>
															<li ><a href="shop-listing-2col.html">Grid - 2 Columns</a></li>
															<li ><a href="shop-listing-sidebar.html">Grid - With Sidebar</a></li>
															<li ><a href="shop-listing-list.html">List</a></li>
															<li ><a href="shop-product.html">Product Page</a></li>
															<li ><a href="shop-product-2.html">Product Page 2 <span class="badge">NEW</span></a></li>
															<li ><a href="shop-cart.html">Shopping Cart</a></li>
															<li ><a href="shop-checkout.html">Checkout Page - Step 1</a></li>
															<li ><a href="shop-checkout-payment.html">Checkout Page - Step 2</a></li>
															<li ><a href="shop-checkout-review.html">Checkout Page - Step 3</a></li>
															<li ><a href="shop-invoice.html">Invoice</a></li>
														</ul>
													</li>
													<li class="dropdown ">
														<a href="blog-large-image-right-sidebar.html" class="dropdown-toggle" data-toggle="dropdown">Blog</a>
														<ul class="dropdown-menu">
															<li ><a href="index-blog.html">Blog Home <span class="badge">v1.1</span></a></li>
															<li ><a href="index-blog-2.html">Blog Home 2 <span class="badge">NEW</span></a></li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Large Image</a>
																<ul class="dropdown-menu to-left">
																	<li ><a href="blog-large-image-right-sidebar.html">Right Sidebar</a></li>
																	<li ><a href="blog-large-image-left-sidebar.html">Left Sidebar</a></li>
																	<li ><a href="blog-large-image-no-sidebar.html">Without Sidebar</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Medium Image</a>
																<ul class="dropdown-menu to-left">
																	<li ><a href="blog-medium-image-right-sidebar.html">Right Sidebar</a></li>
																	<li ><a href="blog-medium-image-left-sidebar.html">Left Sidebar</a></li>
																	<li ><a href="blog-medium-image-no-sidebar.html">Without Sidebar</a></li>
																</ul>
															</li>
															<li class="dropdown ">
																<a  class="dropdown-toggle" data-toggle="dropdown" href="#">Masonry</a>
																<ul class="dropdown-menu to-left">
																	<li ><a href="blog-masonry-right-sidebar.html">Right Sidebar</a></li>
																	<li ><a href="blog-masonry-left-sidebar.html">Left Sidebar</a></li>
																	<li ><a href="blog-masonry-no-sidebar.html">Without Sidebar</a></li>
																</ul>
															</li>
															<li ><a href="blog-timeline.html">Timeline</a></li>
															<li ><a href="blog-post.html">Blog Post</a></li>
														</ul>
													</li>
												</ul>
												<!-- main-menu end -->
												
												<!-- header dropdown buttons -->
												<div class="header-dropdown-buttons hidden-xs hidden-sm">
													<div class="btn-group dropdown">
														<button type="button" class="btn dropdown-toggle" data-toggle="dropdown"><i class="icon-search"></i></button>
														<ul class="dropdown-menu dropdown-menu-right dropdown-animation">
															<li>
																<form role="search" class="search-box margin-clear">
																	<div class="form-group has-feedback">
																		<input type="text" class="form-control" placeholder="Search">
																		<i class="icon-search form-control-feedback"></i>
																	</div>
																</form>
															</li>
														</ul>
													</div>
													<div class="btn-group dropdown">
														<button type="button" class="btn dropdown-toggle" data-toggle="dropdown"><i class="icon-basket-1"></i><span class="cart-count default-bg">8</span></button>
														<ul class="dropdown-menu dropdown-menu-right dropdown-animation cart">
															<li>
																<table class="table table-hover">
																	<thead>
																		<tr>
																			<th class="quantity">QTY</th>
																			<th class="product">Product</th>
																			<th class="amount">Subtotal</th>
																		</tr>
																	</thead>
																	<tbody>
																		<tr>
																			<td class="quantity">2 x</td>
																			<td class="product"><a href="shop-product.html">Android 4.4 Smartphone</a><span class="small">4.7" Dual Core 1GB</span></td>
																			<td class="amount">$199.00</td>
																		</tr>
																		<tr>
																			<td class="quantity">3 x</td>
																			<td class="product"><a href="shop-product.html">Android 4.2 Tablet</a><span class="small">7.3" Quad Core 2GB</span></td>
																			<td class="amount">$299.00</td>
																		</tr>
																		<tr>
																			<td class="quantity">3 x</td>
																			<td class="product"><a href="shop-product.html">Desktop PC</a><span class="small">Quad Core 3.2MHz, 8GB RAM, 1TB Hard Disk</span></td>
																			<td class="amount">$1499.00</td>
																		</tr>
																		<tr>
																			<td class="total-quantity" colspan="2">Total 8 Items</td>
																			<td class="total-amount">$1997.00</td>
																		</tr>
																	</tbody>
																</table>
																<div class="panel-body text-right">
																	<a href="shop-cart.html" class="btn btn-group btn-gray btn-sm">View Cart</a>
																	<a href="shop-checkout.html" class="btn btn-group btn-gray btn-sm">Checkout</a>
																</div>
															</li>
														</ul>
													</div>
												</div>
												<!-- header dropdown buttons end-->
												
											</div>

										</div>
									</nav>
									<!-- navbar end -->

								</div>
								<!-- main-navigation end -->
								</div>
								<!-- header-right end -->
					
				</header>
				<!-- header end -->
			</div>
			<!-- header-container end -->
		
			<!-- banner start -->
			<!-- ================ -->
			<div class="banner clearfix">

				<!-- slideshow start -->
				<!-- ================ -->
				<div class="slideshow">

					<!-- slider revolution start -->
					<!-- ================ -->
					<div class="slider-revolution-5-container">
						<div id="slider-banner-fullscreen-hero" class="slider-banner-fullscreen-hero rev_slider" data-version="5.0">
							<ul class="slides">
								<!-- slide 1 start -->
								<!-- ================ -->
								<li data-transition="random" data-slotamount="default" data-masterspeed="default" data-title="Unlimited Options and Layouts">

								<!-- main image -->
								<img src="../dict/images/landing-page-2-banner.jpg" alt="slidebg1" data-bgposition="center bottom" data-kenburns="on" data-duration="30000" data-ease="Linear.easeNone" data-scalestart="100" data-scaleend="120" data-rotatestart="0" data-rotateend="0" data-offsetstart="0 0" data-offsetend="0 0" data-bgparallax="10" class="rev-slidebg" data-no-retina>

								<!-- Transparent Background -->
								<div class="tp-caption dark-translucent-bg"
									data-x="center"
									data-y="center"
									data-start="0"
									data-transform_in="opacity:0;s:600;e:Power2.easeInOut;"
									data-transform_out="opacity:0;s:600;s:300;"
									data-width="5000"
									data-height="5000">
								</div>

								<!-- LAYER NR. 1 -->
								<div class="tp-caption large_white text-center hidden-xs"
									data-x="left"
									data-y="center"
									data-voffset="50"
									data-start="800"
									data-end="4500"
									data-width="500"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];opacity:0;s:1500;"
									data-transform_out="y:[-100%];opacity:0;s:1500;"
									><img data-ww="600px" data-hh="451px" src="../dict/images/section-image-1.png" alt="">
								</div>

								<!-- LAYER NR. 2 -->
								<div class="tp-caption large_white text-center hidden-xs"
									data-x="left"
									data-y="center"
									data-voffset="50"
									data-start="4850"
									data-end="8700"
									data-width="500"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];opacity:0;s:1500;"
									data-transform_out="y:[100%];opacity:0;s:1500;"
									><img data-ww="600px" data-hh="451px" src="../dict/images/section-image-2.png" alt="">
								</div>

								<!-- LAYER NR. 3 -->
								<div class="tp-caption large_white text-center hidden-xs"
									data-x="left"
									data-y="center"
									data-voffset="50"
									data-start="9050"
									data-width="500"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];opacity:0;s:1500;"
									data-transform_out="y:[-100%];s:1500;"
									><img data-ww="600px" data-hh="451px" src="../dict/images/section-image-4.png" alt="">
								</div>

								<!-- LAYER NR. 4 -->
								<div class="tp-caption large_white text-center"
									data-x="[right,right,center,center]"
									data-y="[180,240,240,240]"
									data-fontsize="[42,42,36,28]"
									data-start="800"
									data-width="[500,500,full,full]"
									data-hoffset="30"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];opacity:0;s:2000;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									>The Project
								</div>

								<!-- LAYER NR. 5 -->
								<div class="tp-caption large_white tp-resizeme hidden-xs hidden-sm"
									data-x="[right,right,center,center]"
									data-y="230"
									data-start="800"
									data-width="500"
									data-hoffset="30"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];opacity:0;s:2000;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;">
										<div class="separator with-icon light"><i class="fa fa-diamond bordered"></i></div>
								</div>

								<!-- LAYER NR. 6 -->
								<div class="tp-caption medium_white text-center"
									data-x="[right,right,center,center]"
									data-y="330"
									data-start="800"
									data-width="[500,500,750,430]"
									data-fontsize="[24,24,18,16]"
									data-hoffset="30"
									data-whitespace="normal"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];opacity:0;s:2000;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[-100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt, maiores, aliquid. Repellat eum numquam aliquid.
								</div>

								<!-- LAYER NR. 7 -->
								<div class="tp-caption text-center"
									data-x="[right,right,center,center]"
									data-y="470"
									data-start="800"
									data-width="[500,500,full,full]"
									data-hoffset="30"
									data-transform_idle="o:1;"
									data-transform_in="y:[-100%];opacity:0;s:2000;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[-100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;"><a href="#page-start" class="btn btn-default btn-xl margin-clear radius-50 smooth-scroll">Learn More</a>
								</div>

								<!-- LAYER NR. 8 -->
								<div class="tp-caption"
									data-x="center"
									data-y="bottom"
									data-voffset="-100"
									data-start="10000"
									data-transform_idle="o:1;"
									data-transform_in="y:[100%];sX:1;sY:1;o:0;s:2000;e:Power4.easeInOut;"
									data-transform_out="y:[100%];s:1000;e:Power2.easeInOut;"
									data-mask_in="x:0px;y:[100%];s:inherit;e:inherit;"
									data-mask_out="x:inherit;y:inherit;s:inherit;e:inherit;">
										<a href="#page-start" class="btn btn-lg moving smooth-scroll"><i class="icon-down-open-big"></i><i class="icon-down-open-big"></i><i class="icon-down-open-big"></i></a>
								</div>
								</li>
								<!-- slide 1 end -->
							</ul>
						</div>
					</div>
					<!-- slider revolution end -->

				</div>
				<!-- slideshow end -->

			</div>
			<!-- banner end -->

			<div id="page-start"></div>

			<!-- section start -->
			<!-- ================ -->
			<section class="clearfix text-center pv-30 object-non-visible" data-animation-effect="zoomIn" data-effect-delay="300">
				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2">
							<h1 class="text-center">The Project</h1>
							<div class="separator with-icon"><i class="fa fa-diamond bordered"></i></div>
							<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod atque sequi nemo, dolorum quas commodi facere assumenda harum error ab inventore hic porro, modi alias minima veniam quos at, fugiat.</p>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="full-width-section hover-disabled space-bottom">
				<div class="full-image-container ph-40 object-non-visible" data-animation-effect="fadeInLeft" data-effect-delay="300">
					<img class="to-right-block" src="../dict/images/section-image-2.png" alt="">
				</div>
				<div class="full-text-container white-bg ">
					<h2>Feature One</h2>
					<div class="separator-2 visible-lg"></div>
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi veniam, veritatis sint consequuntur! Natus, culpa, explicabo! Non quo laboriosam nobis quia, amet excepturi optio dolor impedit. Perferendis libero unde, nulla deserunt sequi. Voluptatum, officia suscipit porro reprehenderit vitae quo rem reiciendis, a vero quae. Vero beatae voluptatum.</p>
					<div class="separator-3 visible-lg"></div>
					<a href="mailto:theproject@mail.com" class="btn btn-default btn-hvr hvr-sweep-to-left">Read More <i class="pl-10 fa fa-angle-right"></i></a>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="full-width-section light-gray-bg hover-disabled">
				<div class="full-text-container light-gray-bg left text-right">
					<h2>Feature Two</h2>
					<div class="separator-3 visible-lg"></div>
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi veniam, veritatis sint consequuntur! Natus, culpa, explicabo! Non quo laboriosam nobis quia, amet excepturi optio dolor impedit. Perferendis libero unde, nulla deserunt sequi. Voluptatum, officia suscipit porro reprehenderit vitae quo rem reiciendis, a vero quae. Vero beatae voluptatum.</p>
					<div class="separator-2 visible-lg"></div>
					<a href="mailto:theproject@mail.com" class="btn btn-default btn-hvr hvr-sweep-to-right">Read More <i class="pl-10 fa fa-angle-right"></i></a>
				</div>
				<div class="full-image-container ph-40 object-non-visible" data-animation-effect="fadeInRight" data-effect-delay="300">
					<img src="../dict/images/section-image-4.png" alt="">
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="full-width-section hover-disabled space-top">
				<div class="full-image-container ph-40 object-non-visible space-bottom" data-animation-effect="fadeInLeft" data-effect-delay="300">
					<img class="to-right-block" src="../dict/images/section-image-1.png" alt="">
				</div>
				<div class="full-text-container white-bg">
					<h2>Feature Three</h2>
					<div class="separator-2 visible-lg"></div>
					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi veniam, veritatis sint consequuntur! Natus, culpa, explicabo! Non quo laboriosam nobis quia, amet excepturi optio dolor impedit. Perferendis libero unde, nulla deserunt sequi. Voluptatum, officia suscipit porro reprehenderit vitae quo rem reiciendis, a vero quae. Vero beatae voluptatum.</p>
					<div class="separator-3 visible-lg"></div>
					<a href="mailto:theproject@mail.com" class="btn btn-default btn-hvr hvr-sweep-to-left">Read More <i class="pl-10 fa fa-angle-right"></i></a>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="dark-bg pv-40">
				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2">
							<h2 class="text-center">Key <strong>Features</strong></h2>
							<div class="separator with-icon"><i class="fa fa-check bordered"></i></div>
							<p class="text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam voluptas facere vero ex tempora saepe perspiciatis ducimus sequi animi.</p>
							<br>
						</div>
						<div class="col-md-4 ">
							<div class="pv-30 ph-20 feature-box text-center object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon default-bg"><i class="fa fa-diamond"></i></span>
								<h3>Clean Code &amp; Design</h3>
								<div class="separator clearfix"></div>
								<p class="text-muted">Voluptatem ad provident non repudiandae beatae cupiditate amet reiciendis lorem ipsum dolor sit amet, consectetur.</p>
								<a href="page-services.html" class="btn btn-gray-transparent radius-50 btn-animated">Read More<i class="fa fa-angle-double-right"></i></a>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-30 ph-20 feature-box bordered text-center object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon default-bg"><i class="fa fa-connectdevelop"></i></span>
								<h3>Extremely Flexible</h3>
								<div class="separator clearfix"></div>
								<p>Iure sequi unde hic. Sapiente quaerat sequi inventore veritatis cumque lorem ipsum dolor sit amet, consectetur.</p>
								<a href="page-services.html" class="btn btn-gray-transparent radius-50 btn-animated">Read More<i class="fa fa-angle-double-right"></i></a>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-30 ph-20 feature-box text-center object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon default-bg"><i class="icon-snow"></i></span>
								<h3>Latest Technologies</h3>
								<div class="separator clearfix"></div>
								<p>Inventore dolores aut laboriosam cum consequuntur delectus sequi lorem ipsum dolor sit amet, consectetur.</p>
								<a href="page-services.html" class="btn btn-gray-transparent radius-50 btn-animated">Read More<i class="fa fa-angle-double-right"></i></a>
							</div>
						</div>
					</div>
					<div class="row">
						<div class="col-md-4 ">
							<div class="pv-30 ph-20 feature-box bordered text-center object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon default-bg"><i class="fa fa-support"></i></span>
								<h3>Free Great Support</h3>
								<div class="separator clearfix"></div>
								<p class="text-muted">Voluptatem ad provident non repudiandae beatae cupiditate amet reiciendis lorem ipsum dolor sit amet, consectetur.</p>
								<a href="page-services.html" class="btn btn-gray-transparent radius-50 btn-animated">Read More<i class="fa fa-angle-double-right"></i></a>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-30 ph-20 feature-box text-center object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon default-bg"><i class="fa fa-thumbs-up"></i></span>
								<h3>Easy to Use</h3>
								<div class="separator clearfix"></div>
								<p>Iure sequi unde hic. Sapiente quaerat sequi inventore veritatis cumque lorem ipsum dolor sit amet, consectetur.</p>
								<a href="page-services.html" class="btn btn-gray-transparent radius-50 btn-animated">Read More<i class="fa fa-angle-double-right"></i></a>
							</div>
						</div>
						<div class="col-md-4 ">
							<div class="pv-30 ph-20 feature-box bordered text-center object-non-visible" data-animation-effect="fadeInDownSmall" data-effect-delay="100">
								<span class="icon default-bg"><i class="fa fa-heart"></i></span>
								<h3>Strong Background</h3>
								<div class="separator clearfix"></div>
								<p>Inventore dolores aut laboriosam cum consequuntur delectus sequi lorem ipsum dolor sit amet, consectetur.</p>
								<a href="page-services.html" class="btn btn-gray-transparent radius-50 btn-animated">Read More<i class="fa fa-angle-double-right"></i></a>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="pv-40 clearfix light-gray-bg">
				<div class="owl-carousel content-slider-with-large-controls">
					<div class="container">
						<div class="row">
							<div class="col-md-8 col-md-offset-2">
								<div class="testimonial text-center">
									<div class="testimonial-image">
										<img src="../dict/images/testimonial-1.jpg" alt="Jane Doe" title="Jane Doe" class="img-circle">
									</div>
									<h3>Just Perfect!</h3>
									<div class="separator"></div>
									<div class="testimonial-body">
										<blockquote>
											<p>Sed ut perspiciatis unde omnis iste natu error sit voluptatem accusan tium dolore laud antium, totam rem dolor sit amet tristique pulvinar, turpis arcu rutrum nunc, ac laoreet turpis augue a justo.</p>
										</blockquote>
										<div class="testimonial-info-1">- Jane Doe</div>
										<div class="testimonial-info-2">By Company</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="container">
						<div class="row">
							<div class="col-md-8 col-md-offset-2">
								<div class="testimonial text-center">
									<div class="testimonial-image">
										<img src="../dict/images/testimonial-2.jpg" alt="Jane Doe" title="Jane Doe" class="img-circle">
									</div>
									<h3>Amazing!</h3>
									<div class="separator"></div>
									<div class="testimonial-body">
										<blockquote>
											<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Et cupiditate deleniti ratione in. Expedita nemo, quisquam, fuga adipisci omnis ad mollitia libero culpa nostrum est quia eos esse vel!</p>
										</blockquote>
										<div class="testimonial-info-1">- Jane Doe</div>
										<div class="testimonial-info-2">By Company</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="pv-40">
				<div class="container">
					<h1 class="large text-center">Choose your <strong>Plan</strong></h1>
					<div class="separator with-icon"><i class="fa fa-rocket bordered"></i></div>
					<p class="large text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tenetur veniam natus nemo reiciendis sit eius odio, recusandae, maxime libero delectus ipsa ea aut quo temporibus laboriosam minus dolore vitae iste.</p>
					<!-- pricing tables start -->
					<!-- ================ -->
					<div class="pricing-tables stripped object-non-visible" data-animation-effect="fadeInUpSmall"  data-effect-delay="0">
						<div class="row grid-space-0">
							<!-- pricing table start -->
							<!-- ================ -->
							<div class="col-sm-3 plan stripped">
								<div class="header default-bg">
									<h3>Basic</h3>
									<div class="price"><span>Free</span></div>
								</div>
								<ul>
									<li>1 User</li>
									<li>
										<a href="#" class="pt-popover" data-toggle="popover" data-placement="right" data-content="Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." title="" data-original-title="15GB Storage" data-trigger="hover">1GB Storage</a>
									</li>
									<li>
										<a href="#" class="pt-popover" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." title="" data-original-title="15 Email Acounts">1 Email Acounts</a>
									</li>
									<li>Subdomains</li>
									<li>Security</li>
									<li>Bandwidth</li>
									<li>Databases</li>
									<li><a class="btn btn-default-transparent btn-animated">Subscribe <i class="fa fa-user"></i></a></li>
								</ul>
							</div>
							<!-- pricing table end -->

							<!-- pricing table start -->
							<!-- ================ -->
							<div class="col-sm-3 plan stripped">
								<div class="header default-bg">
									<h3>Premium</h3>
									<div class="price"><span>$19.99</span>/m.</div>
								</div>
								<ul>
									<li>80 Users</li>
									<li>Unlimited Disk Space</li>
									<li>
										<a href="#" class="pt-popover" data-toggle="popover" data-placement="right" data-content="Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." title="" data-original-title="Unlimited Subdomains">Unlimited Email Acounts</a>
									</li>        
									<li>Subdomains</li>
									<li>Security</li>
									<li>500 Visitors per month</li>
									<li>1 Database</li>
									<li><a class="btn btn-default-transparent btn-animated">Add to cart <i class="fa fa-shopping-cart"></i></a></li>
								</ul>
							</div>
							<!-- pricing table end -->

							<!-- pricing table start -->
							<!-- ================ -->
							<div class="col-sm-3 plan stripped best-value">
								<div class="header default-bg">
									<h3>Pro</h3>
									<div class="price"><span>$24.99</span>/m.</div>
								</div>
								<ul>
									<li>Unlimited Users</li>
									<li>Unlimited Disk Space</li>
									<li>Unlimited Email Acounts</li>
									<li>Unlimited Subdomains</li>
									<li>
										<a href="#" class="pt-popover" data-toggle="popover" data-placement="right" data-content="Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." title="" data-original-title="Enchaned Security">Enchaned Security</a>
									</li>
									<li>Unlimited Bandwidth</li>
									<li>Unlimited Databases</li>
									<li><a class="btn btn-default-transparent btn-animated">Add to cart <i class="fa fa-shopping-cart"></i></a></li>
								</ul>
							</div>
							<!-- pricing table end -->
							
							<!-- pricing table start -->
							<!-- ================ -->
							<div class="col-sm-3 plan">
								<div class="header default-bg">
									<h3>Ultimate</h3>
									<div class="price"><span>$45.99</span>/m.</div>
								</div>
								<ul>
									<li>Unlimited Users</li>
									<li>Unlimited Disk Space</li>
									<li>Unlimited Email Acounts</li>
									<li>Unlimited Subdomains</li>
									<li>
										<a href="#" class="pt-popover" data-toggle="popover" data-placement="right" data-content="Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." title="" data-original-title="Enchaned Security">Enchaned Security</a>
									</li>
									<li>Unlimited Bandwidth</li>
									<li>Unlimited Databases</li>
									<li><a class="btn btn-default-transparent btn-animated">Add to cart <i class="fa fa-shopping-cart"></i></a></li>
								</ul>
							</div>
							<!-- pricing table end -->

						</div>
					</div>
					<!-- pricing tables end -->
				</div>
			</section>
			<!-- section end -->

			<!-- section start -->
			<!-- ================ -->
			<section class="dark-translucent-bg parallax-2 pv-40" style="background: url(../dict/images/landing-background-img-1.jpg) 50% 50% no-repeat;">

				<div class="container">
					<div class="row">
						<div class="col-md-8 col-md-offset-2">
							<h1 class="text-center">The Project's Stats</h1>
							<div class="separator with-icon"><i class="fa fa-thumbs-up bordered"></i></div>
							<p class="text-center">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod atque sequi nemo, dolorum quas commodi facere assumenda harum error ab inventore hic porro, modi alias minima veniam quos at, fugiat.</p>
						</div>
					</div>
				</div>

				<div class="stats">
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon default-bg large circle"><i class="fa fa-diamond"></i></span>
							<h3><strong>Projects</strong></h3>
							<span class="counter" data-to="1525" data-speed="5000">0</span>
						</div>
					</div>
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon default-bg large circle"><i class="fa fa-users"></i></span>
							<h3><strong>Clients</strong></h3>
							<span class="counter" data-to="1225" data-speed="5000">0</span>
						</div>
					</div>
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon default-bg large circle"><i class="fa fa-cloud-download"></i></span>
							<h3><strong>Downloads</strong></h3>
							<span class="counter" data-to="12235" data-speed="5000">0</span>
						</div>
					</div>
					<div class="col-md-3 col-xs-6 text-center">
						<div class="feature-box object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
							<span class="icon default-bg large circle"><i class="fa fa-share"></i></span>
							<h3><strong>Shares</strong></h3>
							<span class="counter" data-to="15002" data-speed="5000">0</span>
						</div>
					</div>
				</div>
			</section>
			<!-- section end -->

			<!-- footer top start -->
			<!-- ================ -->
			<div class="light-gray-bg footer-top border-clear">
				<div class="container">
					<div class="row">
						<div class="col-md-12">
							<div class="clients-container">
								<div class="clients margin-clear">
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="100">
										<a href="#"><img src="../dict/images/client-1.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="200">
										<a href="#"><img src="../dict/images/client-2.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="300">
										<a href="#"><img src="../dict/images/client-3.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="400">
										<a href="#"><img src="../dict/images/client-4.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="500">
										<a href="#"><img src="../dict/images/client-5.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="600">
										<a href="#"><img src="../dict/images/client-6.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="700">
										<a href="#"><img src="../dict/images/client-7.png" alt=""></a>
									</div>
									<div class="client-image object-non-visible" data-animation-effect="fadeIn" data-effect-delay="800">
										<a href="#"><img src="../dict/images/client-8.png" alt=""></a>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- footer top end -->

			<!-- footer start (Add "dark" class to #footer in order to enable dark footer) -->
			<!-- ================ -->
			<footer id="footer" class="clearfix ">

				<!-- .footer start -->
				<!-- ================ -->
				<div class="footer">
					<div class="container">
						<div class="footer-inner">
							<div class="row">
								<div class="col-sm-6 col-md-3 col-lg-4 col-lg-offset-1">
									<div class="footer-content">
										<h2 class="title">Find Us</h2>
										<ul class="list-icons">
											<li><i class="fa fa-map-marker pr-10 text-default"></i> One infinity loop, 54100</li>
											<li><i class="fa fa-phone pr-10 text-default"></i> +00 1234567890</li>
											<li><a href="mailto:info@theproject.com"><i class="fa fa-envelope-o pr-10"></i>info@theproject.com</a></li>
										</ul>
										<a class="collapsed map-show btn-lg-link padding-hor-clear" data-toggle="collapse" href="#collapseContact" aria-expanded="false" aria-controls="collapseContact"><i class="fa fa-envelope pr-20"></i>Contact Us</a>
									</div>
								</div>
								<div class="col-sm-6 col-md-3 col-lg-4 col-lg-offset-1">
									<div class="footer-content">
										<h2 class="title">Follow Us</h2>
										<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro fugiat accusantium similique modi alias consectetur nesciunt.</p>
										<ul class="social-links large circle animated-effect-1">
											<li class="facebook"><a target="_blank" href="http://www.facebook.com"><i class="fa fa-facebook"></i></a></li>
											<li class="twitter"><a target="_blank" href="http://www.twitter.com"><i class="fa fa-twitter"></i></a></li>
											<li class="googleplus"><a target="_blank" href="http://plus.google.com"><i class="fa fa-google-plus"></i></a></li>
											<li class="linkedin"><a target="_blank" href="http://www.linkedin.com"><i class="fa fa-linkedin"></i></a></li>
											<li class="xing"><a target="_blank" href="http://www.xing.com"><i class="fa fa-xing"></i></a></li>
										</ul>
									</div>
								</div>
							</div>
							<div class="row">
								<div class="clearfix visible-sm"></div>
								<section id="collapseContact" class="collapse">
									<div class="col-md-10 col-md-offset-1">
										<div class="footer-content">
											<h2 class="title">Contact Us</h2>
											<div class="alert alert-success hidden" id="MessageSent2">
												We have received your message, we will contact you very soon.
											</div>
											<div class="alert alert-danger hidden" id="MessageNotSent2">
												Oops! Something went wrong please refresh the page and try again.
											</div>
											<form role="form" id="footer-form" class="margin-clear">
												<div class="row">
													<div class="col-sm-6">
														<div class="form-group has-feedback mb-10">
															<label class="sr-only" for="name2">Name</label>
															<input type="text" class="form-control" id="name2" placeholder="Name" name="name2">
															<i class="fa fa-user form-control-feedback"></i>
														</div>
													</div>
													<div class="col-sm-6">
														<div class="form-group has-feedback mb-10">
															<label class="sr-only" for="email2">Email address</label>
															<input type="email" class="form-control" id="email2" placeholder="Enter email" name="email2">
															<i class="fa fa-envelope form-control-feedback"></i>
														</div>
													</div>
												</div>
												<div class="form-group has-feedback mb-10">
													<label class="sr-only" for="message2">Message</label>
													<textarea class="form-control" rows="4" id="message2" placeholder="Message" name="message2"></textarea>
													<i class="fa fa-pencil form-control-feedback"></i>
												</div>
												<input type="submit" value="Send" class="margin-clear submit-button radius-50 btn btn-default">
											</form>
										</div>
									</div>
								</section>
							</div>
							<div class="separator"></div>
							<div class="row">
								<div class="col-md-12">
									<div class="call-to-action text-center">
										<div class="row">
											<div class="col-sm-8 col-sm-offset-2">
												<br>
												<form class="form-inline">
													<div class="form-group has-feedback">
														<label class="sr-only" for="subscribe3">Email address</label>
														<input type="email" class="form-control radius-50 form-control-lg" id="subscribe3" placeholder="Enter email" name="subscribe3" required="">
														<i class="fa fa-envelope form-control-feedback"></i>
													</div>
													<button type="submit" class="btn btn-lg btn-gray-transparent radius-50 btn-animated margin-clear">Subscribe <i class="fa fa-send"></i></button>
												</form>
												<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus error pariatur deserunt <br> laudantium nam, mollitia quas nihil inventore, quibusdam?</p>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- .footer end -->

				<!-- .subfooter start -->
				<!-- ================ -->
				<div class="subfooter">
					<div class="container">
						<div class="subfooter-inner">
							<div class="row">
								<div class="col-md-12">
									<p class="text-center">Copyright © 2016 The Project by <a target="_blank" href="http://htmlcoder.me">HtmlCoder</a>. All Rights Reserved</p>
								</div>
							</div>
						</div>
					</div>
				</div>
				<!-- .subfooter end -->

			</footer>
			<!-- footer end -->
			
		</div>
		<!-- page-wrapper end -->

		<!-- JavaScript files placed at the end of the document so the pages load faster -->
		<!-- ================================================== -->
		<!-- Jquery and Bootstap core js files -->
		<script type="text/javascript" src="../plugins/jquery.min.js"></script>
		<script type="text/javascript" src="../plugins/bootstrap/js/bootstrap.min.js"></script>
		<!-- Modernizr javascript -->
		<script type="text/javascript" src="../plugins/modernizr.js"></script>
		<script type="text/javascript" src="../plugins/rs-plugin-5/js/jquery.themepunch.tools.min.js?rev=5.0"></script>
		<script type="text/javascript" src="../plugins/rs-plugin-5/js/jquery.themepunch.revolution.min.js?rev=5.0"></script>
		<!-- Isotope javascript -->
		<script type="text/javascript" src="../plugins/isotope/isotope.pkgd.min.js"></script>
		<!-- Magnific Popup javascript -->
		<script type="text/javascript" src="../plugins/magnific-popup/jquery.magnific-popup.min.js"></script>
		<!-- Appear javascript -->
		<script type="text/javascript" src="../plugins/waypoints/jquery.waypoints.min.js"></script>
		<!-- Count To javascript -->
		<script type="text/javascript" src="../plugins/jquery.countTo.js"></script>
		<!-- Parallax javascript -->
		<script src="../plugins/jquery.parallax-1.1.3.js"></script>
		<!-- Contact form -->
		<script src="../plugins/jquery.validate.js"></script>
		<!-- Background Video -->
		<script src="../plugins/vide/jquery.vide.js"></script>
		<!-- Owl carousel javascript -->
		<script type="text/javascript" src="../plugins/owl-carousel/owl.carousel.js"></script>
		<!-- Pace javascript -->
		<script type="text/javascript" src="../plugins/pace/pace.min.js"></script>
		<!-- SmoothScroll javascript -->
		<script type="text/javascript" src="../plugins/jquery.browser.js"></script>
		<script type="text/javascript" src="../plugins/SmoothScroll.js"></script>
		<!-- Initialization of Plugins -->
		<script type="text/javascript" src="../dict/js/template.js"></script>
		<!-- Custom Scripts -->
		<script type="text/javascript" src="../dict/js/custom.js"></script>

	</body>
</html>
